<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
    <link type="text/css" href="styles/base/ui.all.css" rel="stylesheet" />
    <style type="text/css" media="screen">
        @import url("styles/gb.css");
    </style>
    <script type="text/javascript" src="scripts/jquery.min.js "></script>
    <script type="text/javascript" src="scripts/jquery.parsequery.js" ></script>
    <script type="text/javascript" src="scripts/jquery-jtemplates.js"></script>
    <script type="text/javascript" src="scripts/jquery.corner.js"></script>
    <script type="text/javascript" src="scripts/ui/jquery-ui-1.7.2.custom.js"></script>
    <script type="text/javascript" src="scripts/ui/ui.datepicker.js"></script>
    <script type="text/javascript" src="scripts/flowplayer/flowplayer-3.1.1.min.js"></script>
    <script type="text/javascript" src="scripts/date.js"></script>
	<script type="text/javascript" src="scripts/jquery.autocomplete.min.js"></script>
	<script type="text/javascript" src="scripts/navigation.js"></script>
    <script type="text/javascript" src="scripts/jquery.easing.min.js"></script>
    <script type="text/javascript" src="scripts/ajaxupload.js"></script>
	<script>
		function S4() {
		   return (((1+Math.random())*0x10000)|0).toString(16).substring(1);
		}
		function guid() {
		   return (S4()+S4()+"-"+S4()+"-"+S4()+"-"+S4()+"-"+S4()+S4()+S4());
		}


	
		$(function() {
			db_name = findDBName();
			var button = $('#button1'), interval;
			
			var uuid = guid();
			
			var upload = new AjaxUpload(button, {
				action: 'http://localhost:8080/red5plugin/upload/' + uuid, 
				name: 'myfile',
				responseType: 'json',
				onSubmit : function(file, ext){
				
					console.dir(upload);
					upload.action = upload.action
					// change button text, when user selects file			
					button.text('Uploading');
									
					// If you want to allow uploading only 1 file at time,
					// you can disable upload button
					this.disable();
					
					// Uploding -> Uploading. -> Uploading...
					interval = window.setInterval(function(){
						var text = button.text();
						if (text.length < 13){
							button.text(text + '.');					
						} else {
							button.text('Uploading');				
						}
					}, 200);
				},
				onComplete: function(file, response){
					button.text('Upload');
								
					window.clearInterval(interval);
								
					// enable upload button
					this.enable();
					
					// add file to the list
					console.log('upload complete');
					console.dir(response);
				}
			});
		});
	
	</script>
	
	
  </head>
  <body class="primary-4">
	<div id="header"></div>
  
    <div id="content" data-corner="left right 20px">
	   <div id="step1">

			<p>You can style button as you want</p>
			<div class="wrapper">
				<div id="button1" class="button">Upload</div>
			</div>
	   </div>
    </div>
  </body>
</html>
